import React from "react";
import store from "../../store/wwj/index";
import index1 from "../../assets/lh/index.module.css";
import { GET_SINGERWORD } from "../../api/lh/index";
class GetWords extends React.Component {
  constructor() {
    super();
    this.state = {
      word: [
        "A",
        "B",
        "C",
        "D",
        "E",
        "F",
        "G",
        "H",
        "I",
        "J",
        "K",
        "L",
        "M",
        "N",
        "O",
        "P",
        "Q",
        "R",
        "S",
        "T",
        "U",
        "V",
        "W",
        "X",
        "Y",
        "Z"
      ]
    };
  }
  Words(item, cat) {
    store.dispatch(GET_SINGERWORD(item, cat));
    store.getState().getsinger = [];
    store.getState().getremensinger = [];
  }
  render() {
    return (
      <div className={index1.singertop1}>
        <div className={index1.li1}>首字母:</div>
        <ul className={index1.ul}>
          {this.state.word.map((item, index) => (
            <li
              key={index}
              className={index1.li2}
              onClick={this.Words.bind(this, item, this.props.cat)}
            >
              <span>{item}</span>
            </li>
          ))}
        </ul>
      </div>
    );
  }
}
export default GetWords;
